 

$(document).ready(function(){

1.  对WEB标准以及W3C的理解与认识
标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、
使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、
内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，
不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性；

2.xhtml和html有什么区别
HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
最主要的不同：
XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。

3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 
  1)<!DOCTYPE> 声明位于文档中的最前面，处于 <html> 标签之前。告知浏览器的解析器，
     用什么文档类型 规范来解析这个文档。 
  2)严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行。
  3)在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
  4)DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

4.行内元素有哪些?块级元素有哪些?CSS的盒模型?
块级元素：div p h1 h2 h3 h4 form ul
行内元素: a b br i span input select
Css盒模型:内容，border ,margin，padding

5.CSS引入的方式有哪些? link和@import的区别是?
内联 内嵌 外链 导入
区别 ： 1)link与页面同时加载, @import页面网页完全载入以后加载
        2)前者无兼容性，后者CSS2.1以下浏览器不支持
        3)Link 支持使用javascript改变样式，后者不可

6.CSS选择器有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?
    1)id选择器（ # myid）
    2)类选择器（.myclassname）
    3)标签选择器（div, h1, p）
    4)相邻选择器（h1 + p）
    5)子选择器（ul < li）
    6)后代选择器（li a）
    7)通配符选择器（ * ）
    8)属性选择器（a[rel = "external"]）
    9)伪类选择器（a: hover, li: nth - child）
  (2)可继承的样式： font-size font-family color, UL LI DL DD DT;
      不可继承的样式：border padding margin width height ;
  (3)!important >  id > class > tag  
   important 比 内联优先级高

7.前端页面有哪三层构成，分别是什么?作用是什么?
结构层 Html 表示层 CSS 行为层 js

8.css的基本语句构成是?
选择器{属性1:值1;属性2:值2;……}

9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?
Ie(trident) 火狐（Gecko） 谷歌（Blink，WebKit的分支） opear(Presto)

10.写出几种IE6 BUG的解决方法：
1.双边距BUG float引起的 使用display：inline或者_margin
2.3像素问题 使用float引起的 使用dislpay:inline -3px
3.超链接hover 点击后失效 使用正确的书写顺序 link visited hover active
4.Ie z-index问题 给父级添加position:relative
5.Png 透明 使用js代码 改
6.Min-height 最小高度 ！Important 解决
7.select 在ie6下遮盖 使用iframe嵌套
8.为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）
9.png24位的图片在iE6浏览器上出现背景，解决方案是做成PNG8.

11.标签上title与alt属性的区别是什么?
Alt 当图片不显示是 用文字代表。
Title 为该属性提供信息

*?12.描述css reset的作用和用途。
Reset重置浏览器的css默认属性 浏览器的品种不同，样式不同，然后重置，让他们统一

*?13.解释css sprites，如何使用。
Css 精灵 把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量

*?14.浏览器标准模式和怪异模式之间的区别是什么?
盒子模型 渲染模式的不同
使用 window.top.document.compatMode 可显示为什么模式

15.你如何对网站的文件和资源进行优化?期待的解决方案包括：
文件合并
文件最小化/文件压缩
使用CDN托管
缓存的使用

16.什么是语义化的HTML?
直观的认识标签 对于搜索引擎的抓取有好处

17.清除浮动的几种方式，各自的优缺点，参看：http://my.oschina.net/leipeng/blog/221125
  1.使用空标签清除浮动 clear:both（理论上能清楚任何标签，增加无意义的标签）
  2.给父元素添加overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,使用zoom:1用于兼容IE）
    .over-flow{
        overflow: auto; 
        zoom: 1; //zoom: 1; IE
    }
  3.是用afert伪元素清除浮动(用于非IE浏览器)
      1)
        .clearfix { *zoom: 1;}
        .clearfix:after {content: ''; display: table; clear: both;}
      2)
        .clearfix:after {content:""; height:0; visibility:hidden; display:block; clear:both; }
        .clearfix { zoom:1; }//IE
  4.<div style="clear:both"></div>简单明了

Javascript
1.javascript的typeof返回哪些数据类型
Object number function boolean undefined string

2.例举3种强制类型转换和2种隐式类型转换?
强制（parseInt,parseFloat,number）
隐式（== – +）

3.split() join() 的区别
前者是切割成数组的形式，后者是将数组转换成字符串

4.数组方法pop() push() unshift() shift()
Push()尾部添加 
pop()尾部删除
*Unshift()头部添加 shift()头部删除

5.事件绑定和普通事件有什么区别
  普通添加事件的方法不支持添加多个事件，
  addEventListener方式添加事件可以添加多个事件

*6.IE和DOM事件流的区别
  1)执行顺序不一样、
  2)参数不一样
  3)事件加不加on
  4)this指向问题

*7.IE和标准下有哪些兼容性的写法
var ev = e || window.event
var e=(e)?e:window.event;
document.documentElement.clientWidth || document.body.clientWidth
var target = e.srcElement||ev.target//事件源，当前事件的源，EI支持e.srcElement,其他支持ev.target


8.ajax请求的时候get 和post方式的区别
  1)一个在url后面 一个放在虚拟载体里面
  2)get有大小限制2KB
  3)安全问题
  4)post请求必须设置Content-Type值为application/x-form-www-urlencoded
  5)发送请求时,因为get请求的参数都在url里,所以send函数发送的参数为null,
    而post请求在使用send方法时,却需赋予其参数

9.call和apply的区别
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)

10.ajax请求时，如何解释json数据
使用eval parse 鉴于安全性考虑 使用parse更靠谱

11.b继承a的方法
function Animal(name){      
  this.name = name;      
  this.showName = function(){      
    alert(this.name);      
  }      
}      
function Cat(name){    
  Animal.call(this, name);    
}          
var cat = new Cat("Black Cat");     
cat.showName();  

Animal.call(this) 的意思就是使用 Animal对象代替this对象，那么 Cat中不就有Animal的所有属性和方法了吗，Cat对象就能够直接调用Animal的方法以及属性了.

12.写一个获取非行间样式的函数.(此题考察兼容性写法，style，currentStyle，getComputedStyle的区别，
  如果要获取当前对象的颜色信息，IE返回的是16进制的'#ffffff'，而FF返回的是rgb(255,255,255) )
var a = document.getElementById("mydiv");
var res = getStyle(a,'color');
console.log(res)
function getStyle(obj,attr,value){
  if(!value){
    if(obj.currentStyle){ 
    return obj.currentStyle[attr]; //IE独有方法，作用在DOM元素上，不支持伪类
    }else{ 
      return getComputedStyle(obj,false)[attr]; 
    } 
  }else{
    obj.style[attr] = value;
  }
}

*?13.事件委托是什么
让利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！


14.闭包是什么，有什么特性，对页面有什么影响
闭包就是能够读取其他函数内部变量的函数。
http://blog.csdn.net/gaoshanwudi/article/details/7355794 此链接可查看（问这个问题的不是一个公司）
  作用：
  1)保护函数的内部变量
  2)在内存中维持一个变量
  3)通过保护变量实现私有属性和私有方法

15.如何阻止事件冒泡和默认事件
  非IE                   IE
  e.stopPropagation(); window.event.cancelBubble=true;
  e.preventDefault();  window.event.returnValue = false;
16.添加 删除 替换 插入到某个接点的方法
  obj.appendChidld()
  obj.innersetBefore
  obj.replaceChild
  obj.removeChild

*?17.解释jsonp的原理，以及为什么不是真正的ajax
  动态创建script标签，回调函数
  Ajax是页面无刷新请求数据操作
 
*18.javascript的本地对象，内置对象和宿主对象
  本地对象为array obj regexp等可以new实例化
  内置对象为gload Math 等不可以实例化的
  宿主为浏览器自带的document,window 等

19.document load 和document ready的区别 参看：http://www.jb51.net/article/21628.htm
1)
  Document.onload 是在结构和样式,*甚至包括图片*加载完才执行js
  Document.ready原生种没有这个方法，jquery中有 $().ready(function),只在DOM结构加载完后执行
  script加上 defer 等于在页面完全在入后再执行，相当于 window.onload ，但应用上比 window.onload 更灵活！
2) window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个 
  $(document).ready()可以同时编写多个，并且都可以得到执行 
3)window.onload没有简化写法 
  $(document).ready(function(){})可以简写成$(function(){});

20."=="和"==="的不同
1)前者会自动转换类型,后者不会  
2)前者是值比较,后者是类型比较

21.javascript的同源策略
一段脚本只能读取来自于同一来源的窗口和文档的属性，这里的同一来源指的是主机名、协议和端口号的组合

22.编写一个数组去重的方法
Array.prototype.unique = function (){
    var a=[] ;
    var b={};

    for (var i = 0; i < this.length; i++) {
      if(!b[this[i]]){
        a.push(this[i]);
        b[this[i]] = 1;
        console.log(b);
      }
    };
    return a;
  }
  var c=[12,14,26,78,12,48,"你好","melissa"];
  alert(c.unique());

23.relative,absolute,fixed区别
  1)当Position属性值为Relative时对象原来占有的位置保留，其后面的对象按原来文档流仍然保持原来的位置。
  Top的值表示对象相对原位置向下偏移的距离，bottom的值表示对象相对原位置向上偏移的距离，两者同时存在时，只有Top起作用。
  left的值表示对象相对原位置向右偏移的距离，right的值表示对象相对原位置向左偏移的距离，两者同时存在时，只有left起作用。
  2)当Position属性值为absolute时对象从文档流中抽取出来，原占有的位置被后面的对象顶替上来。
  Top的值表示对象上边框与浏览器窗口顶部的距离，bottom的值表示对象下边框与浏览器窗口底部的距离，两者同时存在时，只有Top起作用；如果两者都未指定，则其顶端将与原文档流位置一致，即垂直保持位置不变。
  left的值表示对象左边框与浏览器窗口左边的距离，right的值表示对象右边框与浏览器窗口右边的距离，两者同时存在时，只有left起作用；如果两者都未指定，则其左边将与原文档流位置一致，即水平保持位置不变。 
  注意：在Position属性值为absolute的同时，如果有一级父对象（无论是父对象还是祖父对象，或者再高的辈分，一样）的Position属性值为Relative时，则上述的相对浏览器窗口定位将会变成相对父对象定位，这对精确定位是很有帮助的。
  3) fixed是相对浏览器窗口的位置

24．基本数据类型
  5种：Undefined、Null、Boolean、Number和String。
  还有一种复杂的数据类型Object，Object本质是一组无序的名值对组成的。

26.html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？
如何区分 HTML 和 HTML5？
  (1)HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。
    1)绘画 canvas  
    2)用于媒介回放的 video 和 audio 元素 
    3)本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；
    4)sessionStorage 的数据在浏览器关闭后自动删除
    5)语意化更好的内容元素，比如 article、footer、header、nav、section 
    6)表单控件，calendar、date、time、email、url、search  
    7)新的技术webworker, websockt, Geolocation
  (2)移除的元素
    1)纯表现的元素：basefont，big，center，font, s，strike，tt，u；
    2)对可用性产生负面影响的元素：frame，frameset，noframes；
支持HTML5新标签：
  1)IE8/IE7/IE6支持通过document.createElement方法产生的标签，
    可以利用这一特性让这些浏览器支持HTML5新标签,
    浏览器支持新标签后，还需要添加标签默认的样式：
  2)当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架
     <!--[if lt IE 9]> 
     <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script> 
     <![endif]--> 
  (3)如何区分： DOCTYPE声明\新增的结构元素\功能元素

27.HTML5的离线储存？
  localStorage    长期存储数据，浏览器关闭后数据不丢失；
  sessionStorage  数据在浏览器关闭后自动删除。

26.iframe有那些缺点？
  1)iframe会阻塞主页面的Onload事件；
  2)iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。
  使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好是通过javascript
  动态给iframe添加src属性值，这样可以可以绕开以上两个问题。

27.请描述一下 cookies，sessionStorage 和 localStorage 的区别？
  cookie在浏览器和服务器间来回传递。 sessionStorage和localStorage不会
  sessionStorage和localStorage的存储空间更大；
  sessionStorage和localStorage有更多丰富易用的接口；
  sessionStorage和localStorage各自独立的存储空间；

28.介绍一下CSS的盒子模型？详见：http://www.cnblogs.com/cchyao/archive/2010/07/12/1775846.html
  1)有两种， IE 盒子模型、标准 W3C 盒子模型；IE的content部分包含了 border 和 pading;
  2)盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border).

29.CSS3有哪些新特性？
  CSS3实现圆角（border-radius:8px），
  阴影（box-shadow:10px），
  对文字加特效（text-shadow、），
  线性渐变（gradient），
  旋转（transform）
  transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);//旋转,缩放,定位,倾斜
  增加了更多的CSS选择器  多背景 rgba 

30.CSS3新增伪类举例：
  p:nth-child(2)  选择属于其父元素的第二个子元素的每个 <p> 元素。
  nth-child(odd)或者nth-child(even),选择属于其父元素的单数个节点，或者双数个节点。
  :checked        单选框或复选框被选中。

31.null，undefined 的区别?参看：http://www.ruanyifeng.com/blog/2014/03/undefined-vs-null.html
  (1)Null类型只有一个值，即null。null用来表示尚未存在的对象，所以 typeof null 返回 'object' 。
      null 是 JavaScript 保留关键字。
      null 参与数值运算时其值会自动转换为 0 ，因此，下列表达式计算后会得到正确的数值：
      表达式：123 + null　　　　结果值：123
      表达式：123 * null　　　　结果值：0
      *null表示"没有对象"，即该处不应该有值。典型用法是：
        1） 作为函数的参数，表示该函数的参数不是对象。
        2） 作为对象原型链的终点。
  (2)Undefined类型也只有一个值，即undefined。当声明的变量还未被初始化时，变量的默认值为undefined。
      undefined是全局对象（window）的一个特殊属性，其值是未定义的。但 typeof undefined 返回 'undefined' 。
      undefined参与任何数值计算时，其结果一定是NaN。
      *undefined表示"缺少值"，就是此处应该有一个值，但是还没有定义。典型用法是：
        1）变量被声明了，但没有赋值时，就等于undefined。
        2) 调用函数时，应该提供的参数没有提供，该参数等于undefined。
        3）对象没有赋值的属性，该属性的值为undefined。
        4）函数没有返回值时，默认返回undefined。

32. Firefox 和IE 都可以用这个方法获取自定义属性
  var a=document.getElementById("test").attributes["class"].value;
  var b=document.getElementById("test").getAttribute("class");
  注意：var a=document.getElementById("test").attributes("class").value;在IE中既可以获取一般属性也可以获取常规属性，但在firefox中

33.兼容性问题
  1)Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示, 
    27以下chrome版本可以加入 CSS 属性 -webkit-text-size-adjust: none; 解决,
    27以上的版本只有通过浏览器的设置来改了，如果用transform，则容器的大小也会改变。
  2)鼠标监听事件
    DOMMouseScroll FF
    onmousewheel   非FF
    event.wheelDelta 上滚120 下-120
    event.detail     上滚-3   下3  
  3)获取非行间样式：
    obj.getCurrentStyle[attr]
    getComputedStyle(obj,false)[attr]
  4)当前事件的源
    e.srcElement //EI支持e.srcElement,其他支持ev.target
    e.target

34.解释下浮动和它的工作原理？
    抽出文档流，但是和position：absolute不同，float总是和上一个文档流中的div的底部对齐。参看：http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html

35.判断一个变量是不是对象?
  值类型的类型判断用typeof，引用类型的类型判断用instanceof。

36.写一个通用的事件侦听器函数，一个例子：http://blog.csdn.net/myjlvzlp/article/details/8121696
// event(事件)工具集，来源：github.com/markyun
    markyun.Event = {
        // 页面加载完成后
        readyEvent : function(fn) {
            if (fn==null) {
                fn=document;
            }
            var oldonload = window.onload;
            if (typeof window.onload != 'function') {
                window.onload = fn;
            } else {
                window.onload = function() {
                    oldonload();
                    fn();
                };
            }
        },
        // 视能力分别使用dom0||dom2||IE方式 来绑定事件
        // 参数： 操作的元素,事件名称 ,事件处理程序
        addEvent : function(element, type, handler) {
            if (element.addEventListener) {
                //事件类型、需要执行的函数、是否捕捉
                element.addEventListener(type, handler, false);
            } else if (element.attachEvent) {
                element.attachEvent('on' + type, function() {
                    handler.call(element);
                });
            } else {
                element['on' + type] = handler;
            }
        },
        // 移除事件
        removeEvent : function(element, type, handler) {
            if (element.removeEnentListener) {
                element.removeEnentListener(type, handler, false);
            } else if (element.datachEvent) {
                element.detachEvent('on' + type, handler);
            } else {
                element['on' + type] = null;
            }
        }, 
        // 阻止事件 (主要是事件冒泡，因为IE不支持事件捕获)
        stopPropagation : function(ev) {
            if (ev.stopPropagation) {
                ev.stopPropagation();
            } else {
                ev.cancelBubble = true;
            }
        },
        // 取消事件的默认行为
        preventDefault : function(event) {
            if (event.preventDefault) {
                event.preventDefault();
            } else {
                event.returnValue = false;
            }
        },
        // 获取事件目标
        getTarget : function(event) {
            return event.target || event.srcElement;
        },
        // 获取event对象的引用，取到事件的所有信息，确保随时能使用event；
        getEvent : function(e) {
            var ev = e || window.event;
            if (!ev) {
                var c = this.getEvent.caller;
                while (c) {
                    ev = c.arguments[0];
                    if (ev && Event == ev.constructor) {
                        break;
                    }
                    c = c.caller;
                }
            }
            return ev;
        }
    }; 

37.JavaScript中对事件的三种监听方式
  (1)直接在代码上加载事件
  <tr onmouseover='this.style.backgroundColor="red"' onmouseout='this.style.backgroundColor=""'><td>text1</td><td>text2</td></tr>
  (2)使用DOM的方式获取对象，并加载事件
  doms = document.getElementsByTagName('tr');
  for(i=0;i<doms.length;i++){
    doms[i].onmouseover = function(){
        this.style.backgroundColor = "red";
    }
  }
  (3)是使用标准的addEventListener方式和IE私有的attachEvent方式

38.什么是闭包（closure），闭包的作用？闭包的好处和坏处，参看：http://zhidao.baidu.com/link?url=wUn3I7GY7Yb50GGElQYxOihlp1PHq7cyFfpqTrWTqVWVyB94ONwqUoycmH2BJk7FaO2hLD5iOtm-cT91PHWH3DhU0jfcFblppXTB4_k1qN7
  1)闭包就是能够读取其他函数内部变量的函数。闭包就是将函数内部和函数外部连接起来的一座桥梁
  2)作用：1.可以读取函数内部的变量
          2.让变量的值始终保持在内存中，如下：
    function f1(){
　　　　var n=999;
　　　　nAdd=function(){n+=1}
　　　　function f2(){
　　　　　　alert(n);
　　　　}
　　　　return f2;
　　}
　　var result=f1();
　　result(); // 999
　　nAdd();
　　result(); // 1000
    在这段代码中，result实际上就是闭包f2函数。它一共运行了两次，第一次的值是999，第二次的值是1000。
    这证明了，函数f1中的局部变量n一直保存在内存中，并没有在f1调用后被自动清除。
    为什么会这样呢？原因就在于f1是f2的父函数，而f2被赋给了一个全局变量，这导致f2始终在内存中，而f2的存在依赖于f1，
    因此f1也始终在内存中，不会在调用结束后，被垃圾回收机制（garbage collection）回收。
    这段代码中另一个值得注意的地方，就是"nAdd=function(){n+=1}"这一行，首先在nAdd前面没有使用var关键字，因此nAdd是一个全局变量，而不是局部变量。
    其次，nAdd的值是一个匿名函数（anonymous function），而这个匿名函数本身也是一个闭包，
    所以nAdd相当于是一个setter，可以在函数外部对函数内部的局部变量进行操作。
            3.实现公有，私有，特权变量
        var foo = ( function() {
          var secret = 'secret';
          // “闭包”内的函数可以访问 secret 变量，而 secret 变量对于外部却是隐藏的
          return {
              get_secret: function () {
                  // 通过定义的接口来访问 secret
                  return secret;
              },
              new_secret: function ( new_secret ) {
                  // 通过定义的接口来修改 secret
                  secret = new_secret;
              }
          };
      } () );

      foo.get_secret (); // 得到 'secret'
      foo.secret; // Type error，访问不能
      foo.new_secret ('a new secret'); // 通过函数接口，我们访问并修改了 secret 变量
      foo.get_secret (); // 得到 'a new secret'
  3)坏处：变量的值都保存到内存中，会导致页面加载时内存消耗很大，IE会导致内在泄露，解决方法是，在退出函数之前，将不使用的局部变量全部删除。

39.一个闭包的实际运用：
  <input type='button' id='b1'/>  
  <input type='button' id='b2'/>  
  <input type='button' id='b3'/>  
  上面3个button，功能一样——每当被点击，就alert出自己目前为止一共被点击了多少次； 
那么这个记录点击次数的变量放在哪里？这3个button的功能完全一样，事件函数可以写成一个，
但却需要分别设立变量来存储自己被点击了多少次，那么这个时候闭包的作用就来了：
把他们的事件监听函数设置为同一个函数的闭包，这样一来3个button的点击次数就独立变化了，且没有全局变量产生； 
就像下面这样的代码：
  function genCount(){  
      var i = 0;  
      return function(){  
          i++;  
          alert(i);  
      }  
  }  
  var a = genCount();  
  var b = genCount();  
  a();  
  b();  
  b();  
  b();  
  a(); 
  应该输出1,1,2,3,2，也就是说a和b中的i独立变化

39.5.另一个闭包的例子：
  for(var i=1;i<=3;i++){
    setTimeout(function(){
        console.log(i);    
    },0);  
  };//4 4 4
  如何让上面的例子输出1 2 3 4
  for(var i=1;i<=3;i++){
    setTimeout((function(a){  
    //改成立即执行函数
       console.log(a);    
    })(i),0);  
  };


40.H5的了解,参看：http://www.cnblogs.com/lhb25/p/html5-interview-questions.html
  1)新的 HTML5 文档类型和字符集是？
  2)HTML5 中如何嵌入音频？
  3)HTML5 中如何嵌入视频？
  4)除了 audio 和 video，HTML5 还有哪些媒体标签？
  5)HTML5 Canvas 元素有什么用？
  6)HTML5 存储类型有什么区别？
    sessionstorage用于本地存储一个会话(session)中的数据，这个数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。
    因此sessionstorage不是一种持久化的本地存储，仅仅是会话级别的存储。
    而localstorage用于持久化的本地存储，除非主动删除数据，否则数据是永远也不过期的。
  7)HTML5 有哪些新增的表单元素？
  8)HTML5 废弃了哪些 HTML4 标签？
  9)HTML5 标准提供了哪些新的 API？
  10)HTML5 应用程序缓存和浏览器缓存有什么区别？
    web storage的概念和cookie相似，区别是它是为了更大的容量存储设计的。
    cookie大小受限，并且每次都请求一个新的页面的时候后cookie都会被发送过去，另外cookie还需要指定作用域，不可以跨域调用。
    cookie的作用是与服务器进行交互，作为HTTP规范的一部分存在，而web storage仅仅是为了在本地存储数据而生。
    除此之外，Web Storage拥有setItem,getItem,removeItem,clear等方法，不像cookie需要前端开发者自己封装setCookie，getCookie。

41.css区分IE678,渐进式写法
  .ie6_7_8{
    color:blue; /*所有浏览器*/
    color:red\9; /*IE8以及以下版本浏览器*/
    *color:green; /*IE7及其以下版本浏览器*/
    _color:purple; /*IE6浏览器*/
}

42.理解BFC的概念：参看：http://www.zhangxinxu.com/wordpress/2015/02/css-deep-understand-flow-bfc-column-two-auto-layout/
                        http://www.cnblogs.com/dojo-lzz/p/3999013.html
  BFC全称”Block Formatting Context”, 中文为“块级格式化上下文”。
  什么时候会触发BFC呢？常见的如下：
  1)float的值不为none。
  2)overflow的值为auto,scroll或hidden。
  3)display的值为table-cell, table-caption, inline-block中的任何一个。
  4)position的值不为relative和static。

43.服务器主动推动技术
  一般的服务器Push技术包括：参看：http://blog.csdn.net/shimiso/article/details/8151362
  1)基于 AJAX 的长轮询（long-polling）方式，服务器Hold一段时间后再返回信息；
  2)HTTP Streaming，通过iframe和<script>标签完成数据的传输；
  3)TCP 长连接
  4)HTML5新引入的WebSocket，可以实现服务器主动发送数据至网页端，它和HTTP一样，
  是一个基于HTTP的应用层协议，跑的是TCP，所以本质上还是个长连接，双向通信，
  意味着服务器端和客户端可以同时发送并响应请求，而不再像HTTP的请求和响应
  5)上述的1和2统称为comet技术

44.页面重构的理解,参看：http://www.jb51.net/web/77619.html
  CSS：
    样式表置于顶部
    避免CSS表达式
    使用外部JS、CSS
    削减JS、CSS
    使用<link> 而不用@import
    避免滤镜，如AlphaImageLoader，它会终止内容的呈现并且冻结浏览器
  JS：
    脚本置于底部
    使用外部JS、CSS
    削减JS、CSS
    不用重复脚本
    减少访问和操作DOM
    事件委托

46.css如何让浮动元素水平居中，3个栗子参看：http://www.jb51.net/article/70767.htm
  主题的思路是：父元素和子元素同时左浮动，然后父元素相对左移动50%，再然后子元素相对父元素右移动50%，
  或者子元素相对左移动-50%也就可以了
  html
    <div class="box">
     <p>我是浮动的</p>
     <p>我也是居中的</p>
    </div>
  CSS 部分：
    .box{
     float:left;
     position:relative;
     left:50%;
    }
    p{
     float:left;
     position:relative;
     right:50%;
    }

46.5.js 去掉字符串前后空格
(1)js循环检查替换
//供使用者调用  
function trim(s){  
    return trimRight(trimLeft(s));  
}  
//去掉左边的空白  
function trimLeft(s){  
    if(s == null) {  
        return "";  
    }  
    var whitespace = new String(" \t\n\r");  
    var str = new String(s);  
    if (whitespace.indexOf(str.charAt(0)) != -1) {  
        var j=0, i = str.length;  
        while (j < i && whitespace.indexOf(str.charAt(j)) != -1){  
            j++;  
        }  
        str = str.substring(j, i);  
    }  
    return str;  
}  

//去掉右边的空白   
function trimRight(s){  
    if(s == null) return "";  
    var whitespace = new String(" \t\n\r");  
    var str = new String(s);  
    if (whitespace.indexOf(str.charAt(str.length-1)) != -1){  
        var i = str.length - 1;  
        while (i >= 0 && whitespace.indexOf(str.charAt(i)) != -1){  
           i--;  
        }  
        str = str.substring(0, i+1);  
    }  
    return str;  
}

47.js分页代码：详见：test_pagiantion.html

48.js中substring,substr,slice区别
    1)stringObject.substring(start,end),开始和结束的位置，从零开始的索引,substring方法使用start和end两者中的较小值作为子字符串的起始点。如果start或end为NaN或者为负数，那么将其替换为0。
    2)stringObject.substr(start [, length ]),start必需,所需的子字符串的起始位置,字符串中的第一个字符的索引为 0;length 可选,在返回的子字符串中应包括的字符个数。
    3)strObj.slice(start[,end]),start下标从0开始的strObj指定部分其实索引。如果start为负，将它作为length+start处理，此处length为字符串的长度。
      end小标从0开始的strObj指定部分结束索引。如果end为负，将它作为length+end处理，此处length为字符串的长度。

49.js string 常用方法：
  String.slice(start,end)
  String.substring(start,end)
  String.substr(start,end)
  strObj.charAt(index)
  strObj.indexOf(substr[,startIndex])
  str.concat([string1[,string2...]])
  strObj.split([separator[,limit]])
  toLowerCase
  toUpperCase 

50.js 引用类型和基本类型的区别：
  基本类型：指的是保存在栈内存中的简单数据段；按值访问，操作的是他们实际保存的值；
            包括5种：null，undefined，Boolean,string，number
  引用类型值：指的是那些保存在堆内存中的对象，意思是，变量中保存的实际上只是一个指针，这个指针执行内存中的另一个位置，
            由该位置保存对象；按引用访问，当查询时，我们需要先从栈中读取内存地址，然后再顺藤摸瓜地找到保存在堆内存中的值；function，array，object

51. prototype的理解 参看：http://www.cnblogs.com/wangfupeng1988/p/3977924.html
  一切（引用类型）都是对象，对象是属性的集合
  对象都是通过函数创建的
  每个函数都有一个属性叫做prototype
  这个prototype的属性值是一个对象（属性的集合，再次强调！），默认的只有一个叫做constructor的属性，指向这个函数本身。  
  每个对象都有一个隐藏的属性——“__proto__”，这个属性引用了创建这个对象的函数的prototype。即：fn.__proto__ === Fn.prototype
  所以：每个函数function都有一个prototype，即原型。这里再加一句话——每个对象都有一个__proto__，可成为隐式原型。
  Function也是一个函数，函数是一种对象，也有__proto__属性。既然是函数，那么它一定是被Function创建。所以——Function是被自身创建的。所以它的__proto__指向了自身的Prototype。

52.原型链
  访问一个对象的属性时，先在基本属性中查找，如果没有，再沿着__proto__这条链向上找，这就是原型链

  所有的对象的原型链都会找到Object.prototype，因此所有的对象都会有Object.prototype的方法。这就是所谓的“继承”。

  说一个函数的例子吧。我们都知道每个函数都有call，apply方法，都有length，arguments，caller等属性。为什么每个函数都有？这肯定是“继承”的。函数由Function函数创建，因此继承的Function.prototype中的方法。

52.执行上下文
  javascript在执行一个代码段之前，都会进行这些“准备工作”来生成执行上下文
  1)变量、函数表达式——变量声明，默认赋值为undefined；
  2)this——赋值；
  3)函数声明——赋值；
  这三种数据的准备情况我们称之为“执行上下文”或者“执行上下文环境”。

  其实，javascript在执行一个代码段之前，都会进行这些“准备工作”来生成执行上下文。这个“代码段”其实分三种情况——全局代码，函数体，eval代码。
  
  函数每被调用一次，都会产生一个新的执行上下文环境(参数赋值,arguments赋值,自由变量的取值作用域 赋值)。

53.在函数中this到底取何值，是在函数真正被调用执行的时候确定的，函数定义的时候确定不了。因为this的取值是执行上下文环境的一部分，每次调用函数，都会产生一个新的执行上下文环境。
  1)如果函数作为构造函数用，那么其中的this就代表它即将new出来的对象。
  2)如果直接调用Foo函数，而不是new Foo()，情况就大不一样了。这种情况下this是window，我们后文中会说到。
  3)如果函数作为对象的一个属性时，并且作为对象的一个属性被调用时，函数中的this指向该对象。
  4)如果fn函数不作为obj的一个属性被调用，而是被赋值到了另一个变量中，并没有作为obj的一个属性被调用，那么this的值就是window
  5)当一个函数被call和apply调用时，this的值就取传入的对象的值
  6)在全局环境下，this永远是window，这个应该没有非议。
  7)在构造函数的prototype中，this代表着当前对象的值
  其实，不仅仅是构造函数的prototype，即便是在整个原型链中，this代表的也都是当前对象的值。

});

 
